Ext.define('Admin.view.Detail', {
    extend: 'Ext.panel.Panel',
	alias: 'widget.detail',
	margin: '10px 0px 0px 10px',
	cls: 'userProfile-container dashboard',
	scrollable:true,

	tbar: [{
		iconCls: 'x-fa fa-angle-left',
		handler: 'onPrev',
		ui:'back',
		bind: {
			hidden: '{!showprev}'
		}
	},{
		iconCls: 'x-fa fa-angle-right',
		handler: 'onNext',
		bind: {
			hidden: '{!shownext}'
		}
	},
		{
		xtype: 'spacer'
	},{
		text: '保存',
		handler: 'onSaveClick',
		ui: 'action'
	},{
		text: '取消',
		ui: 'action',
		handler: 'onBackClick'
	}],

    requires: [
       'Ext.form.Panel',
       'Ext.field.Text',
       'Ext.field.TextArea',
       'Ext.layout.VBox',
       'Ext.field.Select'
    ],
    header:false,
    layout: {
        type: 'vbox',
        pack: 'start',
        align: 'stretch'
	},
    
    bodyPadding: 0,
        
    onScrollMove:function(x,y){
    	var items_navpos=this.items_navpos;
    	//var offset=0;
    	var h0 = this.getHeight();
    	for(var i=0; i<items_navpos.length; i++){
    		var item_navpos=items_navpos[i];
    		var posY = item_navpos.getPosition()[1];
    		//header落在移动窗口之内,或移动窗口在 两个offset之间都算
    		if (posY>=0 && posY <= h0 )
    			break;
    		//offset+=h;    		
		}
    	var item=items_navpos[i];
    	this.nav(item);
    },
    nav:function(item,e){
    	if(!item)
    		return false;
    	if(this.item_last){
    		if(this.item_last==item)
    			return false;
    		this.item_last.setUi(null);
    	}
    	var pnav = item.pnav; 
    	if(e){
			pnav.el.scrollIntoView(this.bodyElement.el,null,true);   
    	}
		item.setUi('action');
    	this.item_last=item;
    },
    refreshNav:function(){
    	var items_dock=[];
    	var items_navpos=this.query('[cls=nav_pos]');
    	var me = this;
    	me.item_last=false;
    	for(var i=0; i<items_navpos.length; i++){
    		var item_navpos=items_navpos[i];
    		var item_dock = {
    			text:item_navpos.getTitle(),
    			pnav:item_navpos,
    			handler:me.nav,
    			scope: me
    		};
    		items_dock[items_dock.length]=item_dock;
		}
		this.items_navpos=items_navpos;
		if(items_dock.length>1){
			var tbar = this.down('toolbar');
			for(var i=items_dock.length-1; i>=0; i--)
				tbar.insertFirst(items_dock[i]);
		}
	   	if(this.masker){
    		setTimeout(function(){
    			if(me.masker){
    				me.masker.hide();
    				delete me.masker;
    			}
    		},100);
    	}
    },
    afterRender: function() {
    	this.refreshNav();
    	this.callParent();
    },
    printLabel:function(){
    	var flds = this.query('field');
    	for(fld in flds){
    		var l = fld.getFieldLabel();
    		var b = fld.getBind();
    		console.log('--------'+b);
    	}
    },
    initComponent: function() {   
        this.callParent(arguments);
    }
    
});
